<template>
  <div class="hotsearch">
    <dl>
      <dd>热搜：</dd>
      <dt>亲子游</dt>
      <dt>海底捞</dt>
      <dt>火锅</dt>
      <dt>自助餐</dt>
      <dt>商场</dt>
      <dt>咖啡</dt>
    </dl>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.hotsearch {
  width: 100%;
  height: 10.667vw;
  display: flex;
  align-items: center;
  font-size: 3.2vw;
  dl {
    display: flex;
    justify-content: start;
  }
  dd {
    display: inline-block;
    font-size: 2.667vw;
    padding: 0 1.8vw 0 0;
    margin: 0.533vw 0;
    height: 5.333vw;
    line-height: 5.333vw;
  }
  dt {
    display: inline-block;
    height: 5.333vw;
    line-height: 5.333vw;
    margin: 0.533vw 0.8vw;
    padding: 0 1.2vw;
    background-color: rgba(231, 229, 229, 0.534);
    border-radius: 2.133vw;
  }
}
</style>